<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-spring4-4.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width" />
    <meta name="author" content="www.lzqcode.com" />
    <meta name="robots" content="all" />
    <title>留言板</title>
    <link rel="stylesheet" th:href="@{../../static/desk/font-awesome/css/font-awesome.min.css}">
    <link rel="stylesheet" th:href="@{../../static/desk/layui/css/layui.css}" />
    <link rel="stylesheet" th:href="@{../../static/desk/css/master.css}" />
    <link rel="stylesheet" th:href="@{../../static/desk/css/gloable.css}" />
    <link rel="stylesheet" th:href="@{../../static/desk/css/nprogress.css}" />
    <link rel="stylesheet" th:href="@{../../static/desk/css/message.css}" /> 
</head>
<body>
    <div class="header">
    </div>
    <header th:insert="front_template :: header"></header>
    <div class="doc-container" id="doc-container">
        <div class="container-fixed">
    <div class="container-inner">
        <section class="msg-remark">
            <h1>留言板</h1>
            <p>
                沟通交流，拉近你我！
            </p>
        </section>
        <div class="textarea-wrap message" id="textarea-wrap">
            <form class="layui-form blog-editor" method="post" th:action="@{|/message/add|}">
                <div class="layui-form-item">
                    <textarea name="content" lay-verify="content" id="remarkEditor" placeholder="请输入内容" class="layui-textarea layui-hide"></textarea>
                </div>
                <div class="layui-form-item">
                    <button class="layui-btn" lay-submit="formLeaveMessage" lay-filter="formLeaveMessage">提交留言</button>
                </div>
            </form>
        </div>
    </div>
    <div class="f-cb"></div>
    <div class="mt20">
        <ul class="message-list" id="message-list" th:each="map:${dataList}">
            <li class="zoomIn article"> 
                <div class="comment-parent">
                    <a name="remark-1"></a>
                    <img th:src="${ map.user == null ? '../../static/desk/image/t2.png' : map.user.avatarUrl}" />
                    <div class="info">
                        <span class="username" th:text="${map.user == null ? '游客' : map.user.realName}"></span>
                    </div>
                    <div class="comment-content" th:utext="${map.message.content}">

                    </div>
                    <p class="info info-footer">
                        <i class="fa fa-calendar" aria-hidden="true"></i>
                        <span class="comment-time" th:text="${#dates.format(map.message.createDate,'yyyy-MM-dd HH:mm:ss')}"></span>
                    </p>
                </div>
                <hr />
            </li>
        </ul>
    </div>
</div>
    </div>
    <footer class="grid-footer">
        <div class="footer-fixed">
            <div class="copyright">
                <div class="info">
                    <div class="contact">
                        <a th:href="@{../../static/desk/javascript:void(0)}" class="github" target="_blank"><i class="fa fa-github"></i></a>
                        <a th:href="@{../../static/desk/#}" class="qq" target="_blank" ><i class="fa fa-qq"></i></a>
                        <a th:href="@{../../static/desk/#}" class="email" target="_blank" ><i class="fa fa-envelope"></i></a>
                        <a th:href="@{../../static/desk/javascript:void(0)}" class="weixin"><i class="fa fa-weixin"></i></a>
                    </div>
                    <p class="mt05">
                        Copyright &copy; 2010-2021 ZQ博客 All Rights Reserved V.3.1.3 Power by ZQ博客
                    </p>
                </div>
            </div>
        </div>
    </footer>
    <script th:src="@{../../static/desk/layui/layui.js}"></script>
    <script th:src="@{../../static/desk/js/yss/gloable.js}"></script>
    <script th:src="@{../../static/desk/js/plugins/nprogress.js}"></script>
    <script>NProgress.start();</script>
    <script th:src="@{../../static/desk/js/pagemessage.js}"></script>
    <script>NProgress.start();</script>
    <script> 
        window.onload = function () {
            NProgress.done();
        };
    </script>
</body>
</html>
